<style>
    .operator-mg{
        background:#FFFEE6;
        color:#8F5700;
        padding:12px;
    }
    .operator-mg-tip{
        width:16px;
        height:16px;
        margin-right:8px;
        float:left;
    }
</style>
<script type="text/javascript">
    function addService() {
        $('#service-manage-input-account').removeAttr('disabled');
        $('#service-manage-input-account').removeAttr('readonly');
        $('#service-manage-dlg').dialog('open').dialog('setTitle', '添加客服人员');
        $('#service-manage-dlg-fm').form('clear');
        url = '<?php echo $this->config->item('base_url'); ?>service/addService';
    }
    function editService() {
        $('#service-manage-input-account').attr('disabled', 'true');
        $('#service-manage-input-account').attr('readonly', 'readonly');
        var row = $('#service-manage-list').datagrid('getSelected');
        if (row) {
            $('#service-manage-dlg').dialog('open').dialog('setTitle', '编辑客服人员');
            row.pwd = null;
            $('#service-manage-dlg-fm').form('load', row);
            url = '<?php echo $this->config->item('base_url'); ?>service/editService?id=' + row.id;
        } else {
            $.messager.confirm('错误', '请左击选中条目');
        }
    }
    function saveService() {
        $('#service-manage-dlg-fm').form('submit', {
            url: url,
            onSubmit: function () {
                return $(this).form('validate');
            },
            success: function (result) {
                var result = eval('(' + result + ')');
                if (result.errorMsg) {
                    $.messager.show({
                        title: '保存失败',
                        msg: result.errorMsg
                    });
                } else {
                    $('#service-manage-dlg').dialog('close');
                    $('#service-manage-list').datagrid('reload');
                }
            }
        });
    }
    function removeService() {
        var row = $('#service-manage-list').datagrid('getSelected');
        if (row) {
            $.messager.confirm('提醒', '删除的用户将无法恢复', function (r) {
                if (r) {
                    $.post('<?php echo $this->config->item('base_url'); ?>service/deleteService', {id: row.id}, function (result) {
                        if (result) {
                            $('#service-manage-list').datagrid('reload');
                        } else {
                            $.messager.show({
                                title: '删除失败',
                                msg: result.errorMsg
                            });
                        }
                    }, 'json');
                }
            });
        } else {
            $.messager.confirm('提醒', '请左击选中删除条目');
        }
    }
    function serviceManageSearch() {
        $('#service-manage-list').datagrid('load', {
            account: $('#service-manage-account').val(),
            name: $('#service-manage-name').val(),
            group: $('#service-manage-group').combotree('getValues'),
            online: $('#service-manage-online').combobox('getValue'),
            stime: $('#service-manage-stime').datetimebox('getValue'),
            etime: $('#service-manage-etime').datetimebox('getValue')
        });
    }
    function serviceManageReset() {
        $('#service-manage-account').val('');
        $('#service-manage-name').val('');
        $('#service-manage-group').combotree('setValue', null);
        $('#service-manage-online').combobox('setValue', 2);
        $('#service-manage-stime').datetimebox('setValue', '');
        $('#service-manage-etime').datetimebox('setValue', '');
    }
    //添加右击菜单内容
    function onRowMenuManageService(e, rowIndex, rowData) {
        e.preventDefault();
        var selected = $("#service-manage-list").datagrid('getRows'); //获取所有行集合对象
        selected[rowIndex].id; //index为当前右键行的索引，指向当前行对象
        $('#service-manage-dlg_menu').menu('show', {
            left: e.pageX,
            top: e.pageY
        });
    }
</script>
<div class="operator-mg">
    <div class="operator-mg-tip icon-tip"></div>
    <div>温馨提示：在列表中点击右键可以弹出操作菜单</div>
</div>
<!--数据表格-->
<table id="service-manage-list" class="easyui-datagrid" 
       url="<?php echo $this->config->item('base_url'); ?>service/getservice"
       title="客服管理" toolbar="#service-manage-tb"
       rownumbers="true" pagination="true"
       singleSelect="true" fitColumns="true"
       data-options ="onRowContextMenu:onRowMenuManageService">
    <thead>
        <tr>
            <th field="group_name" align="center" width="60">归属客服组</th>
            <th field="group_account" align="center" width="60">客服组账号</th>
            <th field="id" align="center" width="50">ID</th>
            <th field="name" align="center" width="50">姓名</th>
            <th field="account" align="center" width="60">账号</th>
            <th field="phone" align="center" width="50">手机</th>
            <th field="email" align="center" width="80">邮箱</th>
            <th field="offer" align="center" width="50">职位</th>
            <th field="last_login" align="center" width="70">最后登录</th>
        </tr>
    </thead>
</table>
<!--工具栏及搜索框-->
<div id="service-manage-tb" style="padding:10px;height:auto">
    <div>
        <a class="easyui-linkbutton" onclick="addService()" iconCls="icon-add" plain="true"></a>
        <a class="easyui-linkbutton" onclick="removeService()" iconCls="icon-remove" plain="true"></a>
        <a class="easyui-linkbutton" onclick="editService()" iconCls="icon-edit" plain="true"></a>
    </div>
    <div style="padding:10px">
        <label>客服账户：</label><input id="service-manage-account"  style="width:80px">
        <label>客服姓名：</label><input id="service-manage-name" style="width:80px;">
        <label>客服组：</label>
        <select id="service-manage-group" name="group" class="easyui-combotree" panelHeight="auto" style="width:180px;" multiple
                data-options="url:'<?php echo $this->config->item('base_url'); ?>service/getServiceGroupTree'">
        </select>
        <label>在线客服：</label>
        <select id="service-manage-online" class="easyui-combobox" panelHeight="auto">
            <option value="2">不限制</option>
            <option value="1">在线</option>
            <option value="0">离线</option>
        </select>
        <label>最后登录时间段：</label>
        从<input id="service-manage-stime" class="easyui-datetimebox"  style="width:150px;">
        到<input id="service-manage-etime" class="easyui-datetimebox" style="width:150px;">
        <br/><br/>
        <button onclick="serviceManageSearch()">搜索</button>
        <button onclick="serviceManageReset()">重置</button>
    </div>
</div>
<!--编辑弹框-->
<div id="service-manage-dlg" class="easyui-dialog" style="width:auto;height:auto;padding:10px 20px"
     closed="true" buttons="#service-manage-dlg-buttons">
    <form id="service-manage-dlg-fm" method="post">
        <div class="fitem">
            <label>账户名:</label>
            <input id="service-manage-input-account" name="account">
        </div>
        <div class="fitem">
            <label>真实姓名:</label>
            <input id="service-manage-input-name" name="name">
        </div>
        <div id="service-manage-input-pwd" class="fitem">
            <label>密码:</label>
            <input name="pwd" type="password">
        </div>
        <div class="fitem">
            <label>手机:</label>
            <input name="phone">
        </div>
        <div class="fitem">
            <label>邮箱:</label>
            <input name="email" class="easyui-validatebox" validType="email">
        </div>
        <div class="fitem">
            <label>职位:</label>
            <input name="offer">
        </div>
        <div class="fitem">
            <label>归属客服组:</label>
            <select id="service-manage-group" name="groupid" class="easyui-combotree" panelHeight="auto" style="width:160px;"
                    data-options="url:'<?php echo $this->config->item('base_url'); ?>service/getServiceGroupTree'">
            </select>
        </div>
    </form>
</div>
<div id="service-manage-dlg-buttons">
    <a class="easyui-linkbutton" iconCls="icon-ok" onclick="saveService()">保存</a>
    <a class="easyui-linkbutton" iconCls="icon-cancel" onclick="$('#service-manage-dlg').dialog('close')">取消</a>
</div>
<!--右键菜单-->
<div id="service-manage-dlg_menu" class="easyui-menu" style="width:120px;">
    <div onClick="editService()" data-options="iconCls:'icon-edit'">修改</div>
    <div onClick="addService()" data-options="iconCls:'icon-add'">添加</div>
    <div onClick="removeService()" data-options="iconCls:'icon-remove'">删除</div>
    <div class="menu-sep"></div>
    <div onClick="$('#service-manage-list').datagrid('reload');" data-options="iconCls:'icon-reload'">刷新</div>
</div>
